<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <hr />
    <div>pageX: {{ pageX }}</div>
    <div>pageY: {{ pageY }}</div>
  </div>
</template>

<script>
import { onMounted, onUnmounted, ref } from "vue";
// 需求: 自定义hook钩子函数
// 可以把获取鼠标位置封装成一个功能函数,以后但凡想要获取鼠标实时位置的时候,引入这个功能函数即可
// 这个函数就叫hook钩子函数
import getMouseLocation from "./12";
export default {
  name: "HelloWorld",
  props: {
    msg: String,
  },
  setup() {
    const { pageX, pageY } = getMouseLocation();
    return {
      pageX,
      pageY,
    };
  },
};
</script>

<style scoped>
</style>
